<%@page contentType="text/html"%>
<%@page pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jstl/core_rt" prefix="c"%>
<!DOCTYPE html>
<html>
    <head>
        <title>一笑网-发帖</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta name="viewport" content="width=device-width, initial-scale=1.0">
        <link rel="stylesheet" href="../../static/layui/css/layui.css" />
        <link rel="stylesheet" href="../../static/css/yx.css" />
        
        <script src="../../static/js/jquery-2.1.4.min.js" ></script>
        <script src="../../static/layui/layui.all.js" ></script>
        <script src="../../static/js/yx.js" ></script>
        
        <style type="text/css">
        	
        	.cthh{line-height: 2em; text-indent: 1em;margin-top: 0.8em;}
        	
        	
        	.c1 h2,.c2 h2{font-size: 18px; height: 50px; line-height:60px;text-indent: 1em;color:#333;}
        	
        	/*发表人*/
        	.c1{
        		width: calc(100% - 30rem);
        		float: left;
        		margin-bottom: 1em;
        		background-color: #FFF;
        	}
        	
        	.p_fox{margin: 2rem 0px;}
        	.layui-form-label{width: 3.5em;}
        	
        	.phh{width: 60%;}
        	.fwb{background-color: #FFF;margin: 0px auto;width: 90%;}
        	.fabu{margin-left: 2.5em;}
        	
        	.update{display: none;}
        	
        	/* 页面右部分 */
        	.c2{width: 29rem;background-color: #FFF; float: right;}
        	.c2 p{margin:0.5em 1em;line-height: 2.5rem;text-indent: 1em;color: #333;}
        	
        	
        </style>
        <script>
        	
        	$(function(){
        		
        		layui.form.render();	//渲染一下下拉列表框
        		
        		//富文本编辑器
        		var layedit = layui.layedit;
        		layedit.set({"uploadImage":{'url':'../../ajax/doUpImg','type':'post'}});
        		var fid=layedit.build('ptext');
        		
        		//拦截富文本编辑器的图片上传函数
        		$("[name=file]").on("click",function(){
        			if($("[name=tid]").val()==1){
        				layer.msg("请在类别选择 [图片] 或其它...");
        				return false;
        			}
        			$(".upf").click();
        			return false;	//返回false,停止事件链的继续执行
        		})
        		
        		//上传文件
        		var upload = layui.upload;
        		upload.render({
					elem: '.upf' 				//绑定元素
					,url: 'doUpImg.ajax' 	//上传接口
					,before:function(){
						layer.load(1);
					}
					,done: function(data){
						layer.closeAll('loading'); //关闭loading
						if(data.res=="-1"){return layer.msg(data.msg);}
					  	//上传完毕回调
					  	setImg(data.msg);
					}
					,error: function(e,ee){
						layer.closeAll('loading'); //关闭loading
						layer.alert("上传失败，异常："+e);
				    }
				});
				
				//插入一张图片
				var setImg=function(src){
					if($("[name=tubi]").prop('checked')==true){
				  		layedit.setContent(fid,"<p><img class='img-max' src='../.."+src+"'/></p><br/>",true);
				  }else{
				  		layedit.setContent(fid,"<p><img src='../.."+src+"'/></p><br/>",true);
				  	}
				}
				
				//验证帖子合法性
				var chePost=function(){
        			if($("[name=tid]").val()==1){
        				layer.msg("请在类别选择 [图片] 或其它...");
        				return false;
        			}
        			return true;
				}
        		
        		
        			
        		//发表帖子
        		$(".fabu").click(function(){
        			
        			if($("[name=p_hh]").val().trim().length<2){
        				return layer.msg("标题太短了吧也。。。");
        			}
        			if(layedit.getContent(fid).length<10){
        				return layer.msg("正文太短了吧也。。。");
        			}
        			layedit.sync(fid);	//同步编辑器
        			
        			$.post2("doFBPost.ajax",$("#ff").serialize(),function(data){
        				
        				if(data.res==-9){return layer.msg("未登录");}
        				if(data.res==-1){return layer.msg(data.msg);}
    					if(data.res==1){
    						layer.msg("发表成功");
    						setTimeout(function(){
    							location.href="rpt.html?pid="+data.msg;
    						},500);
    						$("[name=p_hh]").val("");	//清空数据
    						$("[name=p_text]").val("");
    						layedit.setContent(fid,"",false);
    					}
        			},function(e,ee,eee){
        				layer.alert("发表失败："+eee)
        			})
        			
        		})
        		
        		
        		
        	})
        	
        </script>
    </head>
    <body>
    	<div class="aa"> 
    		<%@include file="../in/in_head.jsp"%> <!-- 头部导入 -->
    	</div>
    	
    	<!-- 身体部分 -->
    	<br />
    	<div class="cc yx-max-width">
    		
    		
    		
    		<!-- c1 帖子内容部分 -->
    		<ul class="c1 yx-phone-max">
    			
    			<h3 class="cthh yx-color-one">帖子发表</h3>
    			
    			<form id="ff" action="#" method="post" class="layui-form" >
    				<input type="hidden" name="pid" value="${p.pid}"/>
    				
    				<div class="p_fox">
    					<label class="layui-form-label">标题:</label>
    					<input name="p_hh" class="phh yx-input layui-input" placeholder="标题" value="${p.p_hh}" />
    				</div>
    				
    				<div class="p_fox">
    					<label class="layui-form-label">类型:</label>
    					<div class="ffox" style="width: 5em;display: inline-block;float: left;">
	    					<select name="tid">
	    						<c:forEach items="${ptypes}" var="t" >
	    							<option value="${t.tid}" ${t.tid==p.tid?"selected":""}>${t.t_name}</option>
	    						</c:forEach>
								
							</select>
						</div>
						
						<span style="display: inline-block;">
							<span style="position: relative;top: 5px;margin-left: 1em;">图片比例：</span>
							<input type="checkbox" name="tubi" lay-skin="switch" lay-text="最大|原始" />
						</span>
						
    				</div>

					<!-- 富文本编辑器 -->
    				<div class="p_fox">
    					<div class="fwb">
    						<textarea name="p_text" id="ptext" placeholder="正文">${p.p_text}</textarea>
    					</div>
    				</div>
    				
    				<div class="p_fox">
		    			<button type="button" class="fabu layui-btn layui-btn-danger">
		    				<i class="layui-icon">&#xe609;</i> 发表
		    			</button>
		    			<!--<button type="button" class="fabu2cao layui-btn layui-btn-danger">
		    				<i class="layui-icon">&#xe642;</i> 发表为草稿
		    			</button>-->
		    			<button type="button" class="upf layui-btn yx-hide">上传文件</button>
    				</div>
    				
    			</form>
    			
    			
    		</ul>
    		
    		<!-- 页面右部分 -->
    		<div class="c2 yx-phone-max">
    			<h3 class="cthh yx-color-one">提示</h3>
    			<p>1、提倡优质发帖，拒绝滥竽充数！</p>
    			<p>2、本网站有权在不提醒作者的前提下，将涉嫌黄、赌、毒以及政治敏感等违规内容删除</p>
    			<p>3、每次发表一次优质内容帖子，可以获得10积分，每次回帖可以获得3积分。不明白积分有什么用？看看自己头衔就知道了</p>
    			<p>4、IE-11 浏览器下表情功能无法使用，要怪就怪微软吧，IE兼容性简直一坨*，什么？你问我怎么看自己的浏览器是不是IE-11？如果你的浏览器图标是一个绿色的e,并且你经常更新浏览器版本，那90%就是IE-11了，更简单的，你直接试一下表情功能有没有效果就可以了</p>
    			<p>5、消灭IE，人人有责！</p>
    		</div>
    		
    		
    		<!-- 918清除浮动运动 -->
    		<br style="clear: both;"/>
    	
    	</div>
    	
    	
    	
    	
    	
    	
    	<!-- 页面底部 版权部分 -->
    	<div class="ff">
    		<%@include file="../in/in_bottom.jsp"%> <!-- 底部导入 -->
    	</div>
    	
    	
 	</body>
</html>